<template>
    <div>
        <div style="margin-bottom: 20px;">
            <el-button type="primary" @click="init">刷新</el-button>
            <el-button type="primary" @click="save">保存</el-button>
            <el-button type="primary" @click="add">新建变量</el-button>
        </div>
        <el-table border :data="setting">
            <el-table-column type="index"/>
            <el-table-column label="变量名">
                <el-input v-model="scope.row.key" slot-scope="scope"/>
            </el-table-column>
            <el-table-column label="变量值">
                <el-input type="textarea" v-model="scope.row.value" slot-scope="scope"/>
            </el-table-column>
            <el-table-column label="操作">
                <el-button type="text" @click="setting.splice(scope.$index,1)" slot-scope="scope">删除</el-button>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
    import ws from "./socket/socket"
    export default {
        name: "user-manage",
        data(){
            return {
                setting: []
            }
        },
        methods:{
            async save(){
                var r = await ws.send("REQ_SAVE_SETTING", this.setting)
                if(r.code == 0){
                    this.$message.success("保存成功")
                }
            },
            add(){
                this.setting.push({key: "", value:""})
            },
            async init(){
                var r = await ws.send("REQ_LOAD_SETTING")
                this.setting = r || []
            }
        },
        async mounted() {
            this.init()
            // var r = await ws.send("haha", 123)
            // console.log("r2", r)
        }
    }
</script>

<style scoped>

</style>
